<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"> 
    <head> 
    <title>状况备案-查询</title> 
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" >
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <!--<link rel="stylesheet" type="text/css" href="css/Status_record/Status_record_query/demo.css"/>-->

		<link th:href="@{/public/bootstrap/css/bootstrap.min.css}" rel="stylesheet">
		<link th:href="@{/css/Status_record/status_record.css}" rel="stylesheet">
		<link th:href="@{/css/Daily_items/font-awesome.css?v=4.4.0}" rel="stylesheet">
		<link th:href="@{/css/Daily_items/plugins/iCheck/custom.css}" rel="stylesheet">
		<link th:href="@{/css/Daily_items/animate.css}" rel="stylesheet">
		<link th:href="@{/css/Daily_items/style.css?v=4.1.0}" rel="stylesheet">

    <script th:src="@{/public/jquery/jquery-3.1.1.min.js}"></script>
    <script th:src="@{/js/Status_record/Status_record_query/Status_record_query.js}"></script>

    <script th:src="@{/js/Status_record/Status_record_query/jspdf.js}"></script>
    <script th:src="@{/js/Status_record/Status_record_query/base64.js}"></script>
	<script th:src="@{/public/bootstrap/js/bootstrap.min.js?v=3.3.6}"></script>
    
    </head>

	<body class="fixed-sidebar full-height-layout gray-bg" style="overflow:hidden">
	<!-- 引入页面头header-fragment -->
	<div th:replace="header::header-nav"></div>
	<!-- 引入工具栏sidebar-fragment -->
	<!--/*@thymesVar id="path" type="templates"*/-->
	<div th:replace="sidebar::sidebar-fragment(${path})"></div>

	<div id="page-wrapper" class="gray-bg dashbard-4">
		<div class="row">
			<div class="bread">
				<ol class="breadcrumb">
					<li>状况备案</li>
					<li class="active">事件记录查询</li>
				</ol>
			</div>
			<div class="hr-line-dashed"></div>
			<div style="height:180px;margin-top:50px;">
				<div id="record_query" style="width:80%;margin:0 auto;text-align: center;font-size:14px;">
					<div style="height:40px;">
						<label class="col-sm-2 control-label">事件名称</label>
						<div class="col-sm-6">
							<input id="eventName" name="eventName" type="text" class="form-control m-b" aria-label="请输入事件名称"
								   th:value="${eventEntity!=null and eventEntity.eventName!=null }?${eventEntity.eventName}:''" required="true">
						</div>
						<label class="col-sm-2 control-label">事件类型</label>
						<div class="col-sm-2">
							<select id="recordTypeId" name="typeName" class="form-control m-b">
								<option th:each="tp : ${typeList}" th:value="${tp.typeId}" th:text="${tp.typeName}" selected="-请选择-">-请选择-</option>
							</select>
						</div>
					</div>
					<div style="height:40px;margin-bottom:20px;">
						<div class="form-group">
							<label class="col-sm-2 control-label">时间选择</label>
							<div class="col-sm-6 " style="text-align:left">
								<input id="happenTime" name="happenTime" class="form-control  m-b layer-date" width="100%" placeholder="开始日期" onclick="laydate({istime: true, format: 'YYYY-MM-DD'})">
								<input id="remarkTime" name="remarkTime" class="form-control  m-b layer-date" width="100%" placeholder="结束日期" onclick="laydate({istime: true, format: 'YYYY-MM-DD'})">
							</div>
						</div>
						<label class="col-sm-2 control-label">发生街道</label>
						<div class="col-sm-2">
							<input id="happenStreet" name="happenStreet" type="text" class="form-control  m-b"
								   th:value="${eventEntity!=null and eventEntity.happenStreet!=null }?${eventEntity.happenStreet}:''" required="true">
						</div>
					</div>
				</div>
				<div class="form-group col-sm-12" style="margin: 0 auto;text-align: center;">
					<div>
						<button class="btn btn-primary" type="submit" onclick="searchContents()">查&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;询</button>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						<button class="btn btn-white" type="reset" onclick="cancels()">重&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;置</button>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						<button class="btn btn-white" type="button" onclick="exportData()">导&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;出</button>
					</div>
				</div>
			</div>
			<div id="text">
				<table class="table table-striped"  >
					<thead>
					<tr>
						<th width="5%"><h4>序号</h4></th>
						<th width="18%"><h4>事件名称</h4></th>
						<th width="12%"><h4>事件类型</h4></th>
						<th width="15%"><h4>发生时间</h4></th>
						<th width="15%"><h4>发生街道</h4></th>
						<th width="15%"><h4>责任单位</h4></th>
						<th width="10%"><h4>查看详情</h4></th>
						<th width="10%"><h4>地图查看</h4></th>

					</tr>
					</thead>
					<tbody id="record" th:fragment="query">
					<tr th:each="rec : ${entityList}">
						<td th:text="${rec.getId()}" class="num" style="">1</td>
						<td th:text="${rec.getEventName()}" class="name"></td>
						<td th:text="${typeList.typeName}" class="startdate"></td>
						<td th:text="${rec.getHappenTime()}" class="enddate"></td>
						<td th:text="${rec.getHappenStreet()}" class="company"></td>
						<td id="responseUnit" th:text="${rec.getResponseUnit()}" class="company2"></td>
						<td  width="100" class="app"><input type="button" value="查看详情" onclick="caozuo()"/></td>
						<td ><button class="btn btn-secondary" type="button">
							<span class="glyphicon glyphicon-map-marker"  aria-hidden="true"></span>
						</button></td>
					</tr>
					<tr>
						<td class="num" style="">1</td>
						<td class="name">无间道</td>
						<td class="startdate">2019-10-01 09:09:18</td>
						<td class="enddate">2020-11-11 12:12:40</td>
						<td class="company">小街道</td>
						<td class="company">无人区</td>
						<td width="100" class="app"><input type="button" value="查看详情" onclick="caozuo()"/></td>
						<td><button class="btn btn-secondary" type="button">
							<span class="glyphicon glyphicon-map-marker"  aria-hidden="true"></span>
						</button></td>
					</tr>
					<tr>
						<td class="num" style="background-color: #2f4050;color:white;">2</td>
						<td class="name">11</td>
						<td class="startdate">22</td>
						<td class="enddate">33</td>
						<td class="company">44</td>
						<td class="company2">55</td>
						<td width="100" class="app"><input type="button" value="查看详情" onclick="caozuo()" /></td>
						<td><button class="btn btn-secondary" type="button">
							<span class="glyphicon glyphicon-map-marker"  aria-hidden="true"></span>
						</button></td>
					</tr>
					<tr>
						<td class="num" style="background-color: #2f4050;color:white;">3</td>
						<td class="name">123</td>
						<td class="startdate">213</td>
						<td class="enddate">132</td>
						<td class="company">231</td>
						<td class="company2">321</td>
						<td width="100" class="app"><input type="button" value="查看详情" onclick="caozuo()"/></td>
						<td><button class="btn btn-secondary" type="button">
							<span class="glyphicon glyphicon-map-marker"  aria-hidden="true"></span>
						</button></td>
					</tr>
					<tr>
						<td class="num" style="background-color: #2f4050;color:white;">4</td>
						<td class="name">1234</td>
						<td class="startdate">2345</td>
						<td class="enddate">4567</td>
						<td class="company">5678</td>
						<td class="company2">6789</td>
						<td width="100" class="app"><input type="button" value="查看详情" onclick="caozuo()"/></td>
						<td><button class="btn btn-secondary" type="button">
							<span class="glyphicon glyphicon-map-marker" aria-hidden="true"></span>
						</button></td>
					</tr>
					<tr>
						<td class="num" style="background-color: #2f4050;color:white;">5</td>
						<td class="name">可</td>
						<td class="startdate">拉</td>
						<td class="enddate">鸡</td>
						<td class="company">倒</td>
						<td class="company2">吧</td>
						<td width="100" class="app"><input type="button" value="查看详情" onclick="caozuo()" style="width:110px;margin:auto"/></td>
						<td><button class="btn btn-secondary" type="button" >
							<span class="glyphicon glyphicon-map-marker"  aria-hidden="true"></span>
						</button></td>
					</tr>
					</tbody>
				</table>
				<div class="row pagination-wrap" style="text-align: center">
					<ul class="pagination pagination-large">
						<li><a href="#">前一页</a></li>
						<li><a href="#">1</a></li>
						<li><a href="#">2</a></li>
						<li><a href="#">3</a></li>
						<li><a href="#">4</a></li>
						<li><a href="#">5</a></li>
						<li><a href="#">后一页</a></li>
					</ul>
				</div>
			</div>
		</div>

		</div>
	<script th:src="@{/plugins/layer/laydate/laydate.js}"></script>
	<script th:src="@{/js/vue/axios.min.js}"></script>
	<script th:src="@{/js/vue/vue.js}"></script>
	<script th:src="@{/js/Status_record/record_query.js}"></script>
    </body>
</html>
